<!DOCTYPE html>

<html lang="en">
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

	<title>HTML5 Player</title>
	<meta name="description" content="HTML5 Music Player">
	<meta name="author" content="zation">
	<link rel="stylesheet" href="css/style.css" type="text/css">
	<script src="js/NPlayer.js" type="text/javascript"></script>
	<script>
		document.addEventListener("DOMContentLoaded", function() {
			var nPlayer = new NPlayer();
		}, false);
	</script>
</head>

<body>
	<div id="nPlayer_playBox" class="nPlayer_playBox">
		<div class="hide">
			<audio id="nPlayer_player"></audio>
		</div>
		
		<div class="nPlayer_playControlBack">
		</div>
		<div class="nPlayer_playControl">
			<div class="nPlayer_play">
				<span class="nPlayer_icon_play" id="nPlayer_play"></span>
			</div>
			<div class="nPlayer_sound">
				<span class="nPlayer_icon_sound" id="nPlayer_sound"></span>
			</div>
		</div>
		<div id="nPlayer_soundControl">
			<div id="nPlayer_soundOutLine">
				<div id="nPlayer_soundInLine"></div>
			</div>
			<div id="nPlayer_soundBar"></div>
		</div>
		<div id="nPlayer_timeNum">
			<span id="nPlayer_timeNumCur">0</span>
			/
			<span id="nPlayer_timeNumMax">0</span>
		</div>
		<div class="nPlayer_modControl">
			<div class="nPlayer_normal">
				<span id="nPlayer_normal" title="普通模式">Norm</span>
			</div>
			<div class="nPlayer_loopOne">
				<span id="nPlayer_loopOne" title="单曲循环">1</span>
			</div>
			<div class="nPlayer_loopAll">
				<span class="nPlayer_icon_loopAll" title="所有循环" id="nPlayer_loopAll"></span>
			</div>
		</div>
		
		<div id="nPlayer_timeControl">
			<div id="nPlayer_timeOutLine">
				<div id="nPlayer_timeInLine"></div>
			</div>
			<div id="nPlayer_timeBar"></div>
		</div>
		
		<div id="nPlayer_list">
			<div class="nPlayer_songListBack"></div>
			<ul id="nPlayer_playList"></ul>
		</div>
		
		<div id="nPlayer_cover"></div>
		<div id="nPlayer_info">
			<div id="nPlayer_infoClose">X</div>
			本音乐播放器基于Javascript与HTML5。<br/>
			您可以通过<i>拖拽</i> 的方式将MP3文件放到网页中播放。<br/>
			建议使用<b>Chrome</b>浏览器来体验本播放器。<br/>
			本播放器所有代码开源，源代码请访问<a target="_blank" href="http://code.google.com/p/html5player/">这里</a>.<br/>
			有任何问题请联系<a href="mailto:zation1@gmail.com">我</a>.<br/>
		</div>
		
		<input type="file" title="添加音乐到播放列表" multiple="multiple" id="nPlayer_fileChoser"/>
		
		<input type="file" title="设置背景图片" id="nPlayer_backChoser"/>
		
		<div id="nPlayer_manu">
			<div id="nPlayer_manuFile">添加</div>
			<div id="nPlayer_manuBack">背景</div>
			<div id="nPlayer_manuReset">重置</div>
			<div id="nPlayer_manuAbout">关于</div>
		</div>
	</div>
</body>
</html>
